<script type="text/javascript">
jQuery(document).ready(function($) {
$('a[rel*=facebox]').facebox({
loading_image : 'facebox/loading.gif',
close_image   : 'facebox/closelabel.gif'
}) 
})
</script>

<script type="text/javascript">
$(window).load(function(){
	//for each description div...
	$('div.description').each(function(){
		//...set the opacity to 0...
		$(this).css('opacity', 0);
		//..set width same as the image...
		$(this).css('width', $(this).siblings('img').width());
		//...get the parent (the wrapper) and set it's width same as the image width... '
		$(this).parent().css('width', $(this).siblings('img').width());
		//...set the display to block
		$(this).css('display', 'block');
	});
	
	$('div.the_image').hover(function(){
		//when mouse hover over the wrapper div
		//get it's children elements with class descriptio
		//and show it using fadeTo
		$(this).children('.description').stop().fadeTo(100, 0.7);
	},function(){
		//when mouse out of the wrapper div
		//use fadeTo to hide the div
		$(this).children('.description').stop().fadeTo(100, 0);
	});
	
});
  
</script>

<script type="text/javascript" language="javascript">
var xmlHttp //Ambil XML HTTP untuk berbagai browser
function GetXmlHttpObject()
{
var xmlHttp=null;
try
 {
 // Firefox, Opera 8.0+, Safari
 xmlHttp=new XMLHttpRequest();
 }
catch (e)
 {
 //Internet Explorer
 try
  {
  xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
  }
 catch (e)
  {
  xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
 }
return xmlHttp;
}
// ================================================================================== showKabOr(str) == start
function show_sort(str)
{ 
xmlHttp=GetXmlHttpObject()
if (xmlHttp==null)
 {
 alert ("Browser does not support HTTP Request")
 return
 }
	var link =  $("#link_id").val();
	var url="<?php echo site_url().'produk/ajax_sort'?>";
	url=url+"/"+str+"/"+link;
	//alert(url);
	xmlHttp.onreadystatechange=stateChangedb;
	xmlHttp.open("GET",url,true);
	xmlHttp.send(null);
}

function stateChangedb() 
{ 
if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
 { 
 document.getElementById("txtHint").innerHTML=xmlHttp.responseText 
 } 
}
// ================================================================================== showKabOr(str) == finish
</script>

<style>
div.the_image{
    float:left;
    position:relative; /* important(so we can absolutely position the description div */ 
    padding:6px;
}
div.description{
    margin-left: 6px;
    width:165px;
    position:absolute; /* absolute position (so we can position it where we want)*/
    bottom:5px; /* position will be on bottom */
    left:0px;
    display:none; /* hide it */
    /* styling bellow */
    background-color:black;
    color:white;
}
div.description_content{
    padding:0px 5px 15px 5px;
}
a.order_link{
    margin-top: 10px;
    padding:2px;
    color:white;
    text-decoration:none;
    border:1px solid #ccc;
}
a.order_link:hover{
    padding:2px;
    color:black;
    background-color:white;
    text-decoration:none;
    border:1px solid #ccc;
}
p#product_name {
    margin-bottom:2px;
}

a#side_link{
    text-decoration:none;
}
#img_prod_fast{
    padding:5px;
    float:left;
}
#detail_prod_fast{
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    border:1px solid #ccc;
    padding:5px;
    height:210px;
}
.name_produk_fast{
    padding:0px 0px 4px 0px;
    line-height: 1.2em;
    color:#000000;
    font-size: 12px;
    font-weight: bold;
}
.desc_produk_fast{
    color:#000000;
    line-height: 1.2em;
    font-size: 11px;
    padding:0px 0px 7px 0px;
    
}
</style>



<div class="left_konten">
<div class="breadcumbs"><?php echo $cumb;?></div>
<div class="sorting">
    <input type="hidden" id="link_id" value="<?php echo $link?>"/>
	<label>Short By :</label>
        <?php if ($key != 0):?>
            <?php echo shortDropdown($key);?>
            <label id="txtHint">  
                <?php echo $hint;?>
				
				<div class="order_by">
                <?php echo anchor($order_by_link.'/asc', $asc_name)?> | <?php echo anchor($order_by_link.'/desc', $desc_name)?>
				</div>
            </label>
            
        <?php else:?>
            <?php echo shortDropdown(0);?>   
            <label id="txtHint">  
            </label>
        <?php endif;?>
        
	
</div>

<hr class="spc">

<!-- list product content -->
	<div class="list_product">                    
			<?php if ($arr_produk):
			$i = 1;
			foreach($arr_produk as $row_produk):?>
			<div class="the_image">
			<a href="#" title="Lihat Detail Produk <?php echo $row_produk['nama_produk']?>"></a>
			<div class="productImg">
                            
				<a href="#" title="Lihat Detail <?php echo $row_produk['nama_produk']?>"></a>
				<div class="thumb">
					<a href="#" title="Lihat <?php echo $row_produk['nama_produk']?>"></a>
					<div><a href="<?php echo base_url().'produk/view/'.$row_produk['prod_brand_id'].'/'.$row_produk['prod_kat_id'].'/'.$row_produk['produk_id'].'/'.alias($row_produk['nama_produk'])?>" title="Lihat Detail <?php echo $row_produk['nama_produk']?>">
						</a><a href="<?php echo base_url().'produk/view/'.$row_produk['prod_brand_id'].'/'.$row_produk['prod_kat_id'].'/'.$row_produk['produk_id'].'/'.alias($row_produk['nama_produk'])?>" title="Lihat Produk <?php echo $row_produk['nama_produk']?>"><img src="<?php echo base_url()?>public/product/<?php echo $row_produk['produk_img_thumb']?>" class="productthumb"></a>
					</div>
				</div>
                       
			</div>
                        <div class='description'>
                            <div class='description_content'>
                                <?php if($row_produk['persen_diskon'] != 0):?>
                                                <div class="productTitle">
                                                        <h5><a href="<?php echo base_url().'produk/view/'.$row_produk['prod_brand_id'].'/'.$row_produk['prod_kat_id'].'/'.$row_produk['produk_id'].'/'.alias($row_produk['nama_produk'])?>" title="Lihat Detail Produk <?php echo $row_produk['nama_produk']?>"><?php echo $row_produk['nama_produk']?></a></h5>
                                                        <h5><span style="text-decoration: line-through;color:#ff0000;"><?php echo formatHarga($row_produk['harga'],'lengkap')?></span> <span style="color:#ff9900;">Disc : <?php echo $row_produk['persen_diskon']?> % </span></h5>
                                                </div>
                                                <div class="productPrice">	
												<h5 class="mainprice_fast"><span>Rp</span> <?php echo formatHarga(getPriceDiskon($row_produk['harga'],$row_produk['persen_diskon']),'lengkap')?>&nbsp;&nbsp;</h5>                                                </div>



                                                <a class="order_link" rel="facebox" title="Beli Produk <?php echo $row_produk['nama_produk']?>" href="#buy<?php echo $i;?>">QUICK SHOP</a>
                                <?php else:?>
                                                <div class="productTitle">
                                                        <h5><a href="<?php echo base_url().'produk/view/'.$row_produk['prod_kat_id'].'/'.$row_produk['produk_id'].'/'.alias($row_produk['nama_produk'])?>" title="Lihat Detail Produk <?php echo $row_produk['nama_produk']?>"><?php echo $row_produk['nama_produk']?></a></h5>
                                                        <h5>&nbsp;</h5>
                                                </div>

                                                <div class="productPrice">	
                                                        <h5 class="mainprice"><span>Rp</span> <?php echo formatHarga($row_produk['harga'],'lengkap')?>&nbsp;&nbsp;</h5>
                                                </div>

                                                <a class="order_link" rel="facebox" title="Beli Produk <?php echo $row_produk['nama_produk']?>" href="#buy<?php echo $i;?>">QUICK SHOP</a>
                                <?php endif;?>
                             </div>
                        </div>
			
                        </div>
		
		
		
		<!-- use Jquery dan Facebox plugin -->
			<div id="buy<?php echo $i;?>" style="display:none;">		
				<div id="img_prod_fast">
					<img class="image_event" alt="<?php echo $row_produk['nama_produk']?>" src="<?php echo base_url()?>public/product/<?php echo $row_produk['produk_img_thumb']?>" />
				</div>
				<div id="detail_prod_fast">
					<div class="name_produk_fast"><?php echo $row_produk['nama_produk']?></div>
					<div class="desc_produk_fast"><?php echo $row_produk['deskripsi']?></div>
                                        <div class="price_fast">
                                            <?php if($row_produk['persen_diskon'] != 0):?>
                                                    <label style="color:#000000;"><strong>PRICE : </strong></label><br>
                                                    <div class="productPrice_fast">	
                                                        <h5 class="discprice_fast"><span style="text-decoration: line-through;color:#ff0000;"><?php echo formatHarga($row_produk['harga'],'lengkap')?></span> <span style="color:#ff9900;">Disc : <?php echo $row_produk['persen_diskon']?> % </span></h5>
                                                    </div>
                                                    <div class="productPrice_fast">	
                                                            <h5 class="mainprice_fast"><span>Rp</span> <?php echo formatHarga(getPriceDiskon($row_produk['harga'],$row_produk['persen_diskon']),'lengkap')?>&nbsp;&nbsp;</h5>
                                                    </div>
                                            <?php else:?>
                                                    <label style="color:#000000;"><strong>PRICE : </strong></label><br>
                                                     <div class="productPrice_fast">	
                                                            <h5 class="mainprice_fast"><span>Rp</span> <?php echo formatHarga($row_produk['harga'],'lengkap')?>&nbsp;&nbsp;</h5>
                                                    </div>
                                            <?php endif;?>
                                        </div>
					
					<p>
					<div id="cart_form">
					
					<form method="post" action="<?php echo base_url().'order/add_cart_fast'?>">
						<label style="color:#000000;"><strong>SIZE : </strong></label>
						 <?php echo sizeDropdown(FALSE,$row_produk['produk_id']);?>


						<label style="color:#000000;"><strong>QTY : </strong></label>
						<input id="prod_val" type="text" name="jml" size="5" value="1"/>
						<input id="id_prod" type="hidden" name="id_prod" value="<?php echo $row_produk['produk_id'];?>"/>			
						<input id="id_kat" type="hidden" name="id_kat" value="<?php echo $row_produk['prod_kat_id'];?>"/>
						<input id="id_brand" type="hidden" name="id_brand" value="<?php echo $row_produk['prod_brand_id'];?>"/>
						<input id="slug" type="hidden" name="slug" value="<?php echo makeslug($row_produk['nama_produk']);?>"/>
						<input type="submit" id="submit" name="submit" value="ADD TO CART"/>
					</form>
					</div>
					</p>
					
				</div>
			</div>
			<?php $i++;?>
		<?php endforeach;?>
		
		
              <?php  else:?>
   
                
                - no data -    
                
                <?php endif?>
	</div>

</div>
<div style="width:100px;height:20px;">
<?php if($this->pagination->create_links()==TRUE):?>
				<p id="pagination"><?php echo $this->pagination->create_links(); ?></p>
		<?php endif; ?>
</div>

